var question = new Array(
"Quy tắc",
"đọc tên:",
"Axit +",
"tên",
"hiđrocacbon",
"no",
"tương ứng",
"+ oic",

"Mạch chính",
"là",
"mạch",
"cacbon",
"dài nhất",
"có",
"chứa",
"nhóm –COOH",

"Mạch cacbon",
"được",
"đánh số",
"bắt đầu từ",
"nhóm -COOH"
);

var resultquestion = new Array(
"01234567",

"89101112131415",
"1617181920",

"89101112131420",
"1617181915"
);

$(function() {
    var li1 = '';var li2 = '';var li3 = '';var li4 = '';var li5 = '';var li6 = ''; var li7 = ''; var li8 = '';var li9 = '';var li10 = '';
    $.each(question, function(key, val) {
        if (key%10 == 0)
            li10 += '<li id="'+key+'" class="ui-state-default ui-corner-all">' + val + '</li>';
        else if (key%9 == 0)
            li9 += '<li id="'+key+'" class="ui-state-default ui-corner-all">' + val + '</li>';
        else if (key%8 ==0)
            li8 += '<li id="'+key+'" class="ui-state-default ui-corner-all">' + val + '</li>';
        else if (key%7 ==0)
            li7 += '<li id="'+key+'" class="ui-state-default ui-corner-all">' + val + '</li>';
        else if (key%6 ==0)
            li6 += '<li id="'+key+'" class="ui-state-default ui-corner-all">' + val + '</li>';
        else if (key%5 ==0)
            li5 += '<li id="'+key+'" class="ui-state-default ui-corner-all">' + val + '</li>';
        else if (key%4 ==0)
            li4 += '<li id="'+key+'" class="ui-state-default ui-corner-all">' + val + '</li>';
        else if (key%3 ==0)
            li3 += '<li id="'+key+'" class="ui-state-default ui-corner-all">' + val + '</li>';
        else if (key%2 ==0)
            li2 += '<li id="'+key+'" class="ui-state-default ui-corner-all">' + val + '</li>';
        else
            li1 += '<li id="'+key+'" class="ui-state-default ui-corner-all">' + val + '</li>';
    });
    $('#sortable1').append(li6);$('#sortable1').append(li7);$('#sortable1').append(li8);$('#sortable1').append(li9);$('#sortable1').append(li10);
    $('#sortable1').append(li1);$('#sortable1').append(li2);$('#sortable1').append(li3);$('#sortable1').append(li4);$('#sortable1').append(li5);

    $( "ul.droptrue" ).sortable({
        connectWith: "ul.group",
        cursor: "move",
        placeholder: "ui-state-highlight"
    });

    $( "ul.group" ).sortable({
        connectWith: "ul.droptrue, ul.group",
        cursor: "move",
        placeholder: "ui-state-highlight"
    });

    $( ".group, .droptrue" ).disableSelection();

    $('#submit').click(function() {
        var result1 = '';
        var result2 = '';
        var result3 = '';
        $('#group1').children().each(function(){
                var kid = $(this);
                result1 += (kid.attr('id'));
        });
        
        $('#group2').children().each(function(){
                var kid = $(this);
                result2 += (kid.attr('id'));
        });

        $('#group3').children().each(function(){
                var kid = $(this);
                result3 += (kid.attr('id'));
        });

        if (result1 == resultquestion[0] 
            && (result2 == resultquestion[1] || result2 == resultquestion[3])
            && (result3 == resultquestion[2] || result3 == resultquestion[4])) {
            $('.dialogNoteS').dialog({
                modal: true,
                buttons: {
                            Ok: function() {
                                location.replace('../group_2/index.html');
                            }
			}
            });
        } else {
            $('.dialogNoteE').dialog({
                modal: true,
                buttons: {
                            Ok: function() {                                
                                $( this ).dialog( "close" );
                            }
			}
            });
        }
    });
});